<template>
	<div class="app-container">
		<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
			label-width="68px">
			<el-form-item label="个人用户id" prop="userId">
				<el-input v-model="queryParams.userId" placeholder="请输入个人用户id" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="姓名" prop="name">
				<el-input v-model="queryParams.name" placeholder="请输入姓名" clearable @keyup.enter.native="handleQuery" />
			</el-form-item>
			<!-- <el-form-item label="性别" prop="gender">
				<el-select v-model="queryParams.gender" placeholder="请选择性别" clearable>
					<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
						:value="dict.value" />
				</el-select>
			</el-form-item>
			<el-form-item label="出生日期" prop="birthDate">
				<el-date-picker clearable v-model="queryParams.birthDate" type="date" value-format="yyyy-MM-dd"
					placeholder="请选择出生日期">
				</el-date-picker>
			</el-form-item> -->
			<el-form-item label="年龄" prop="age">
				<el-input v-model="queryParams.age" placeholder="请输入年龄" clearable @keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="民族" prop="ethnicity">
				<el-input v-model="queryParams.ethnicity" placeholder="请输入民族" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<!-- <el-form-item label="党员" prop="partyMemberDate">
				<el-date-picker clearable v-model="queryParams.partyMemberDate" type="date" value-format="yyyy-MM-dd"
					placeholder="请选择党员时间">
				</el-date-picker>
			</el-form-item> -->
			<el-form-item label="证件号" prop="idCardNumber">
				<el-input v-model="queryParams.idCardNumber" placeholder="请输入证件号" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<!-- <el-form-item label="入职时间" prop="entryDate">
				<el-date-picker clearable v-model="queryParams.entryDate" type="date" value-format="yyyy-MM-dd"
					placeholder="请选择入职时间">
				</el-date-picker>
			</el-form-item>
			<el-form-item label="工作年限" prop="workExperience">
				<el-input v-model="queryParams.workExperience" placeholder="请输入工作年限" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->
			<!-- <el-form-item label="专业技术职务" prop="technicalPosition">
				<el-input v-model="queryParams.technicalPosition" placeholder="请输入专业技术职务" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->
			<!-- <el-form-item label="参加灭火战斗次数" prop="firefightingCount">
				<el-input v-model="queryParams.firefightingCount" placeholder="请输入参加灭火战斗次数" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="参加抢险救援次数" prop="rescueCount">
				<el-input v-model="queryParams.rescueCount" placeholder="请输入参加抢险救援次数" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->
			<el-form-item label="联系电话" prop="phoneNumber">
				<el-input v-model="queryParams.phoneNumber" placeholder="请输入联系电话" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>

			<el-form-item label="学历" prop="education">
				<el-select v-model="queryParams.education" placeholder="请选择">
					<el-option v-for="item in educationList" :key="item.label" :label="item.label" :value="item.label">
					</el-option>
				</el-select>
			</el-form-item>

			<el-form-item label="政治面貌" prop="politicalStatus">
				<el-select v-model="queryParams.politicalStatus" placeholder="请选择">
					<el-option v-for="item in politicalStatusList" :key="item.id" :label="item.politicalStatus"
						:value="item.politicalStatus">
					</el-option>
				</el-select>
			</el-form-item>

			<!-- <el-form-item label="处分" prop="punishment">
				<el-select v-model="queryParams.punishment" placeholder="请选择">
					<el-option v-for="item in punishmentList" :key="item.punishmentId" :label="item.punishmentName"
						:value="item.punishmentName">
					</el-option>
				</el-select>
			</el-form-item> -->

			<!-- <el-form-item label="部职别" prop="unit">
				<el-select v-model="queryParams.unit" placeholder="请选择">
					<el-option v-for="item in unitList" :key="item.id" :label="item.deptName" :value="item.deptName">
					</el-option>
				</el-select>
			</el-form-item> -->

			<!-- <el-form-item label="职务" prop="jobTitle">
				<el-select v-model="queryParams.jobTitle" placeholder="请选择">
					<el-option v-for="item in jobTitleList" :key="item.id" :label="item.jobTitle"
						:value="item.jobTitle">
					</el-option>
				</el-select>
			</el-form-item> -->

			<!-- <el-form-item label="身体状况" prop="healthStatus">
				<el-select v-model="queryParams.healthStatus" placeholder="请选择">
					<el-option v-for="item in healthStatusList" :key="item.id" :label="item.conditionDescription"
						:value="item.conditionDescription">
					</el-option>
				</el-select>
			</el-form-item> -->

			<el-form-item label="消防救援衔" prop="rescueRank">
				<el-select v-model="queryParams.rescueRank" placeholder="请选择">
					<el-option v-for="item in rescueRankList" :key="item.label" :label="item.label"
						:value="item.label">
					</el-option>
				</el-select>
			</el-form-item>

			<el-form-item label="籍贯" prop="birthplace">
				<!-- <el-select v-model="queryParams.birthplace" placeholder="请选择">
					<el-option v-for="item in birthplaceList" :key="item.id" :label="item.city" :value="item.city">
					</el-option>
				</el-select> -->
				<el-input v-model="queryParams.birthplace" placeholder="请输入籍贯" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>

			<el-form-item label="工作岗位" prop="position">
				<el-select v-model="queryParams.position" placeholder="请选择">
					<el-option v-for="item in positionList" :key="item.postId" :label="item.postName"
						:value="item.postName">
					</el-option>
				</el-select>
			</el-form-item>





			<!-- <el-form-item label="毕业院校" prop="graduationSchool">
				<el-input v-model="queryParams.graduationSchool" placeholder="请输入毕业院校" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="所学专业" prop="major">
				<el-input v-model="queryParams.major" placeholder="请输入所学专业" clearable @keyup.enter.native="handleQuery" />
			</el-form-item> -->

			<!-- <el-form-item label="专业资质" prop="certificateName">
				<el-input v-model="queryParams.certificateName" placeholder="请输入专业资质" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->
			<!-- <el-form-item label="作战训练能力自我评估" prop="assessment">
				<el-input v-model="queryParams.assessment" placeholder="请输入作战训练能力自我评估" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->

			<!-- <el-form-item label="部职别" prop="departmentTitle">
				<el-input v-model="queryParams.departmentTitle" placeholder="请输入部职别" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->
			<el-form-item label="人员类别" prop="personnelCategory">
				<el-select v-model="queryParams.personnelCategory" placeholder="请选择">
					<el-option v-for="item in peopleTypeList" :key="item" :label="item.label"
						:value="item.label">
					</el-option>
				</el-select>
			</el-form-item>

			<!-- <el-form-item label="专业技术等级" prop="technicalLevel">
				<el-select v-model="queryParams.technicalLevel" placeholder="请选择">
					<el-option v-for="item in levelList" :key="item.label" :label="item.label"
						:value="item.value">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="入伍（队）地" prop="placeEnlistment">
				<el-input v-model="queryParams.placeEnlistment" placeholder="请输入入伍（队）地" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->

			<el-form-item label="部职别" prop="unit">
				<!-- <span style="margin-left: 20px">部职别</span> -->
				<el-cascader
				v-model="queryParams.unit"
				:options="treeOptions"
				:props="{ checkStrictly: true }"
				@change="unitChange"></el-cascader>
				
			</el-form-item>

			<div class="head-container" v-show="false">
				<el-tree
					:data="deptOptions"
					:props="defaultProps"
					:expand-on-click-node="false"
					:filter-node-method="filterNode"
					ref="tree"
					node-key="id"
					default-expand-all
					highlight-current
					@node-click="handleNodeClick"
				/>
			</div>

			<el-form-item>
				<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
		</el-form>

		<el-row :gutter="10" class="mb8">
			<el-col :span="1.5">
				<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
					v-hasPermi="['firefighter:info:add']">新增</el-button>
			</el-col>
			<el-col :span="1.5">
				<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
					v-hasPermi="['firefighter:info:edit']">修改</el-button>
			</el-col>
			<el-col :span="1.5">
				<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
					@click="handleDelete" v-hasPermi="['firefighter:info:remove']">删除</el-button>
			</el-col>
			<el-col :span="1.5">
				<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
					v-hasPermi="['firefighter:info:export']">导出</el-button>
			</el-col>
			<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
		</el-row>

		<el-table v-loading="loading" :data="infoList" @selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55" align="center" />
			<el-table-column label="消防员唯一标识" align="center" prop="id" />
			<!-- <el-table-column label="个人用户id" align="center" prop="userId" /> -->
			<el-table-column label="姓名" align="center" prop="name" />
<!--			<el-table-column label="部门" align="center" prop="deptIdName" />-->
			<el-table-column label="性别" align="center" prop="gender">
				<template slot-scope="scope">
					<dict-tag :options="dict.type.sys_user_sex" :value="scope.row.gender" />
				</template>
			</el-table-column>
			<el-table-column label="出生日期" align="center" prop="birthDate" width="180">
				<template slot-scope="scope">
					<span>{{ parseTime(scope.row.birthDate, '{y}-{m}-{d}') }}</span>
				</template>
			</el-table-column>
			<el-table-column label="年龄" align="center" prop="age" />
			<!-- <el-table-column label="学历" align="center" prop="education" /> -->
			<el-table-column label="民族" align="center" prop="ethnicity" />
			<el-table-column label="籍贯" align="center" prop="birthplace" />
			<el-table-column label="政治面貌" align="center" prop="politicalStatus" />
			<el-table-column label="党员" align="center" prop="partyMemberDate" width="180">
				<template slot-scope="scope">
					<span>{{ parseTime(scope.row.partyMemberDate, '{y}-{m}-{d}') }}</span>
				</template>
			</el-table-column>
			<el-table-column label="证件号" align="center" prop="idCardNumber" />
			<el-table-column label="部职别" align="center" prop="unit" />
			<el-table-column label="工作岗位" align="center" prop="position" />
			<el-table-column label="职务" align="center" prop="jobTitle" />
			<el-table-column label="身高" align="center" prop="healthStatus" />
			<el-table-column label="体重" align="center" prop="weight" />
			<el-table-column label="入职时间" align="center" prop="entryDate" width="180">
				<template slot-scope="scope">
					<span>{{ parseTime(scope.row.entryDate, '{y}-{m}-{d}') }}</span>
				</template>
			</el-table-column>
			<el-table-column label="工作年限" align="center" prop="workExperience" />
			<el-table-column label="消防救援衔" align="center" prop="rescueRank" />
			<!-- <el-table-column label="专业技术职务" align="center" prop="technicalPosition" /> -->
			<el-table-column label="参加灭火战斗次数" align="center" prop="firefightingCount" />
			<el-table-column label="参加抢险救援次数" align="center" prop="rescueCount" />
			<!-- <el-table-column label="身体状况" align="center" prop="healthStatus" /> -->
			<el-table-column label="联系电话" align="center" prop="phoneNumber" />
			<!-- <el-table-column label="毕业院校" align="center" prop="graduationSchool" /> -->
			<!-- <el-table-column label="所学专业" align="center" prop="major" /> -->
			<el-table-column label="处分情况" align="center" prop="punishment" />
			<!-- <el-table-column label="专业资质" align="center" prop="certificateName" /> -->
			<el-table-column label="专业评估" align="center" prop="assessment" />
			<el-table-column label="证件照" align="center" prop="avatar" width="100">
				<template slot-scope="scope">
					<image-preview :src="scope.row.avatar" :width="50" :height="50" />
				</template>
			</el-table-column>

<!--			<el-table-column label="部职别" align="center" prop="departmentTitle" />-->
			<el-table-column label="人员类别" align="center" prop="personnelCategory" />
			<el-table-column label="专业技术等级" align="center" prop="technicalLevel" />
			<el-table-column label="入伍（队）地" align="center" prop="placeEnlistment" />

			<!-- <el-table-column label="执行重大安保任务" align="center" prop="security" />
			<el-table-column label="重大应急救援任务" align="center" prop="emergency" />
			<el-table-column label="重大灭火任务" align="center" prop="fireName" />
			<el-table-column label="参加重大演习" align="center" prop="drill" />
			<el-table-column label="参加比武竞赛" align="center" prop="fight" />
			<el-table-column label="奖励" align="center" prop="reward" />
			<el-table-column label="培训经历" align="center" prop="experienced" />-->
			<!-- <el-table-column label="获取专业资质" align="center" prop="aptitude" />  -->
			<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150" fixed="right" >
				<template slot-scope="scope">
					<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
						v-hasPermi="['firefighter:info:edit']">修改</el-button>
					<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
						v-hasPermi="['firefighter:info:remove']">删除</el-button>
				</template>
			</el-table-column>
		</el-table>

		<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
			@pagination="getList" />

		<!-- 添加或修改消防员信息对话框 -->
		<el-dialog :title="title" :visible.sync="open" width="40%" append-to-body >
			<el-form :rules="rules" label-width="80px" @submit.native.prevent>
				<!-- <el-form-item label="用户id" prop="userId">
					<el-input v-model="form.userId" placeholder="请输入个人用户id" />
				</el-form-item> -->
				<el-form-item label="姓名" prop="name">
					<el-input v-model="form.name" placeholder="请输入姓名" />
				</el-form-item>
				<el-form-item label="性别" prop="gender">
					<el-select v-model="form.gender" placeholder="请选择性别">
						<el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
							:value="dict.value"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="出生日期" prop="birthDate">
					<el-date-picker clearable v-model="form.birthDate" type="date" value-format="yyyy-MM-dd"
						placeholder="请选择出生日期" @change="userDate">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="年龄" prop="age">
					<el-input v-model="form.age" placeholder="请输入年龄" />
				</el-form-item>

				<el-form-item label="民族" prop="ethnicity">
					<el-input v-model="form.ethnicity" placeholder="请输入民族" />
				</el-form-item>

				<el-form-item label="学历" prop="education">
					<el-select v-model="form.education" placeholder="请选择">
						<el-option v-for="item in educationList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="政治面貌" prop="politicalStatus">
					<el-select v-model="form.politicalStatus" placeholder="请选择"  @change="userType">
						<el-option v-for="item in politicalStatusList" :key="item.id" :label="item.politicalStatus"
							:value="item.politicalStatus">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="入党时间" prop="partyMemberDate" v-show="userTypeRadio == 1">
					<el-date-picker clearable v-model="form.partyMemberDate" type="date" value-format="yyyy-MM-dd"
						placeholder="请选择入党时间" >
					</el-date-picker>
				</el-form-item>

				<el-form-item label="入团时间" prop="partyMemberDate" v-show="userTypeRadio == 2">
					<el-date-picker clearable v-model="form.partyMemberDate" type="date" value-format="yyyy-MM-dd"
						placeholder="请选择入团时间" >
					</el-date-picker>
				</el-form-item>

				<el-form-item label="处分" prop="punishment">
					<el-select v-model="form.punishment" placeholder="请选择">
						<el-option v-for="item in punishmentList" :key="item.punishmentId" :label="item.punishmentName"
							:value="item.punishmentName">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="部职别" prop="unit">
					<el-tree
						:data="treeOptions"
						:props="defaultProps"
						:expand-on-click-node="false"
						:filter-node-method="filterNode"
						ref="tree"
						node-key="id"
						default-expand-all
						highlight-current
						@node-click="handleNodeClick"
					/>
					<!-- <treeselect v-model="form.unit" :options="deptOptions" :show-count="true" placeholder="请选择" /> -->
				</el-form-item>

				<el-form-item label="人员类别" prop="personnelCategory">
					<el-select v-model="form.personnelCategory" placeholder="请选择" @change="peopleType">
						<el-option v-for="item in peopleTypeList" :key="item.id" :label="item.label"
							:value="item" >
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="消防救援衔" prop="rescueRank" v-if="this.form.personnelCategory != '消防员' && this.form.personnelCategory != '政府专职消防员'">
					<el-select v-model="form.rescueRank" placeholder="请选择">
						<el-option v-for="item in rescueRankList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="消防救援衔" prop="rescueRank" v-if="this.form.personnelCategory == '消防员'">
					<el-select v-model="form.rescueRank" placeholder="请选择">
						<el-option v-for="item in rescueRankListP" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="消防救援衔" prop="rescueRank" v-if="this.form.personnelCategory == '政府专职消防员'">
					<el-select v-model="form.rescueRank" placeholder="请选择">
						<el-option v-for="item in rescueRankListZ" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="职务" prop="jobTitle" v-if="this.form.personnelCategory !='专业技术干部'">
					<el-select v-model="form.jobTitle" placeholder="请选择">
						<el-option v-for="item in technicalPositionList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="专业技术职务" prop="jobTitle" v-if="this.form.personnelCategory == '专业技术干部'">
					<el-select v-model="form.jobTitle" placeholder="请选择">
						<el-option v-for="item in jobTitlePositionList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="职级" prop="jobTitle" v-if="this.form.personnelCategory !='专业技术干部'">
					<el-select v-model="form.technicalLevel" placeholder="请选择">
						<el-option v-for="item in technicalLevelList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<el-form-item label="专业技术等级" prop="technicalLevel" v-if="this.form.personnelCategory == '专业技术干部'">
					<el-select v-model="form.technicalLevel" placeholder="请选择">
						<el-option v-for="item in technicalLevelList" :key="item.label" :label="item.label"
							:value="item.label">
						</el-option>
					</el-select>
				</el-form-item>

				<!-- <el-form-item label="身体状况" prop="healthStatus">
					<el-select v-model="form.healthStatus" placeholder="请选择">
						<el-option v-for="item in healthStatusList" :key="item.id" :label="item.conditionDescription"
							:value="item.conditionDescription">
						</el-option>
					</el-select>
				</el-form-item> -->

				<el-form-item label="身高(cm)" prop="healthStatus">
					<el-input v-model="form.healthStatus" placeholder="请输入" />
				</el-form-item>

				<el-form-item label="体重(kg)" prop="weight">
					<el-input v-model="form.weight" placeholder="请输入" />
				</el-form-item>


				<el-form-item label="籍贯" prop="birthplace">
					<!-- <el-select v-model="form.birthplace" placeholder="请选择">
						<el-option v-for="item in birthplaceList" :key="item.id" :label="item.city" :value="item.city">
						</el-option>
					</el-select> -->
					<el-input v-model="form.birthplace" placeholder="请输入籍贯" />
				</el-form-item>

				<el-form-item label="工作岗位" prop="position">
					<el-select v-model="form.position" placeholder="请选择">
						<el-option v-for="item in positionList" :key="item.postId" :label="item.postName"
							:value="item.postName">
						</el-option>
					</el-select>
				</el-form-item>




				<el-form-item label="证件号" prop="idCardNumber">
					<el-input v-model="form.idCardNumber" placeholder="请输入证件号" />
				</el-form-item>
				<el-form-item label="入职时间" prop="entryDate">
					<el-date-picker clearable v-model="form.entryDate" type="date" value-format="yyyy-MM-dd"
						placeholder="请选择入职时间" @change="jobDate">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="工作年限" prop="workExperience">
					<el-input v-model="form.workExperience" placeholder="请输入工作年限" />
				</el-form-item>
				<!-- <el-form-item label="专业技术职务" prop="technicalPosition">
					<el-input v-model="form.technicalPosition" placeholder="请输入专业技术职务" />
				</el-form-item> -->
				<el-form-item label="参加灭火战斗次数" prop="firefightingCount">
					<el-input v-model="form.firefightingCount" placeholder="请输入参加灭火战斗次数" />
				</el-form-item>
				<el-form-item label="参加抢险救援次数" prop="rescueCount">
					<el-input v-model="form.rescueCount" placeholder="请输入参加抢险救援次数" />
				</el-form-item>
				<el-form-item label="联系电话" prop="phoneNumber">
					<el-input v-model="form.phoneNumber" placeholder="请输入联系电话" />
				</el-form-item>
				<!-- <el-form-item label="毕业院校" prop="graduationSchool">
					<el-input v-model="form.graduationSchool" placeholder="请输入毕业院校" />
				</el-form-item>
				<el-form-item label="所学专业" prop="major">
					<el-input v-model="form.major" placeholder="请输入所学专业" />
				</el-form-item> -->

				<!-- <el-form-item label="专业资质" prop="certificateName">
					<el-input v-model="form.certificateName" placeholder="请输入专业资质" />
				</el-form-item> -->
				<el-form-item label="专业评估" prop="assessment">
					<el-input v-model="form.assessment" placeholder="请输入专业评估" />
				</el-form-item>
				<el-form-item label="证件照" prop="avatar">
					<image-upload v-model="form.avatar" />
				</el-form-item>

				<el-form-item label="入伍（队）地" prop="placeEnlistment">
					<el-input v-model="form.placeEnlistment" placeholder="请输入入伍（队）地" />
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitForm">确 定</el-button>
				<el-button @click="cancel">取 消</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		listInfo,
		getInfo,
		delInfo,
		addInfo,
		updateInfo,
		getDateList,
		typeList,
		getRewardList,
		peopleType,
		treeList,
		deptTreeSelect,
		treeSelect,
		getUser
	} from "@/api/firefighter/info";
	import Treeselect from "@riophae/vue-treeselect";
	import "@riophae/vue-treeselect/dist/vue-treeselect.css";

	export default {
		name: "Info",
		dicts: ['sys_normal_disable', 'sys_user_sex'],
  		components: { Treeselect },
		data() {
			return {
				treeOptions:[],
				defaultProps: {
					children: "children",
					label: "label"
				},
				deptOptions:undefined,
				// 级联列表
				treeList:[],
				// 消防救援衔列表
				rescueRankList:[{
					label:"四级指挥长",
				},{
					label:"三级指挥长",
				},{
					label:"二级指挥长",
				},{
					label:"一级指挥长",
				},{
					label:"四级指挥员",
				},{
					label:"三级指挥员",
				},{
					label:"二级指挥员",
				},{
					label:"一级指挥员",
				},],
				// 消防救援衔列表
				rescueRankListP:[{
					label:"四级消防长",
				},{
					label:"三级消防长",
				},{
					label:"二级消防长",
				},{
					label:"一级消防长",
				},{
					label:"四级消防员",
				},{
					label:"三级消防员",
				},{
					label:"二级消防员",
				},{
					label:"一级消防员",
				},],
				rescueRankListZ:[{
					label:"政府专职消防员"
				}],
				jobTitlePositionList:[{
					label:"初级专业技术职务"
				},{
					label:"中级专业技术职务"
				},{
					label:"高级专业技术职务"
				},],
				// 职务/专业技术职务
				technicalPositionList:[{
					label:"政治指导员",
				},{
					label:"站长",
				},{
					label:"副站长",
				},{
					label:"站长助理",
				},{
					label:"分队长",
				},{
					label:"班长",
				},{
					label:"副班长",
				},{
					label:"队员",
				},],
				// 职级/专业技术等级
				technicalLevelList:[
					{ label: '四级'},
					{ label: '五级'},
					{ label: '六级'},
					{ label: '七级'},
					{ label: '八级'},
					{ label: '九级'},
					{ label: '十级'},
					{ label: '十一级'},
					{ label: '十二级'},
					{ label: '十三级'},
					{ label: '十四级'},
				],
				// 入伍队列表
				rewardList:[],
				dialogVisible: false,
				inputs: [], // 用于存储输入框的值
				nextId: 0, // 用于生成唯一键值
				// 人员类别列表
				peopleTypeList:[
					{
						label:"领导干部",
						id:1
					},
					{
						label:"职级干部",
						id:2
					},
					{
						label:"专业技术干部",
						id:3
					},
					{
						label:"消防员",
						id:4
					},
					{
						label:"政府专职消防员",
						id:4
					},
				],
				userTypeRadio:1,
				// 技术等级
				levelList:[{
					label: '四级',
					value: '四级'
				},
				{
					label: '五级',
					value: '五级'
				},
				{
					label: '六级',
					value: '六级'
				},
				{
					label: '七级',
					value: '七级'
				},
				{
					label: '八级',
					value: '八级'
				},
				{
					label: '九级',
					value: '九级'
				},
				{
					label: '十级',
					value: '十级'
				},
				{
					label: '十一级',
					value: '十一级'
				},
				{
					label: '十二级',
					value: '十二级'
				},
				{
					label: '十三级',
					value: '十三级'
				},
				{
					label: '未取得',
					value: '未取得'
				}],
				typeList:[],
				// 遮罩层
				loading: true,
				// 选中数组
				ids: [],
				// 非单个禁用
				single: true,
				// 非多个禁用
				multiple: true,
				// 显示搜索条件
				showSearch: true,
				// 总条数
				total: 0,
				// 消防员信息表格数据
				infoList: [],
				// 弹出层标题
				title: "",
				// 是否显示弹出层
				open: false,
				// 查询参数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					userId: null,
					name: null,
					gender: null,
					birthDate: null,
					age: null,
					education: null,
					ethnicity: null,
					birthplace: null,
					politicalStatus: null,
					partyMemberDate: null,
					idCardNumber: null,
					unit: null,
					position: null,
					jobTitle: null,
					entryDate: null,
					workExperience: null,
					rescueRank: null,
					technicalPosition: null,
					firefightingCount: null,
					rescueCount: null,
					healthStatus: null,
					phoneNumber: null,
					graduationSchool: null,
					punishment: null,
					certificateName: null,
					assessment: null,
					avatar: null,
					major: null,
					departmentTitle: null,
					personnelCategory: null,
					technicalLevel: null,
					placeEnlistment: null,
					deptId: null,
					security: null,
					emergency: null,
					fireName: null,
					drill: null,
					fight: null,
					reward: null,
					experienced: null,
					aptitude: null,
					weight:null
				},
				// 表单参数
				form: {},
				// 表单校验
				rules: {

				},
				// 学历列表
				educationList: [{
					label: '初中',
				},{
					label: '高中',
				},{
					label: '专科',
				},{
					label: '本科',
				},{
					label: '研究生',
				},{
					label: '硕士',
				},{
					label: '博士',
				},],
				// 政治面貌列表
				politicalStatusList: [],
				// 惩罚列表
				punishmentList: [],
				// 单位列表
				unitList: [],
				// 职务列表
				jobTitleList: [],
				// 身体状况列表
				healthStatusList: [],
				// 籍贯列表
				birthplaceList: [],
				// 工作岗位列表
				positionList: [],
			};
		},
		created() {
			this.getTypeList();
			// 获取数据
			this.getList();
			// 获取列表数据
			this.getListDate();

			// this.getTreeList();

			this.getDeptTree()

			this.getTreeList()
		},
		methods: {
			unitChange(e){
				console.log("单位：",e[e.length-1])
				// this.queryParams.unit = e[e.length-1]
				getUser(e[e.length-1]).then(res => {
					console.log("返回的消防员录入成绩：", res.data);
					// this.form.firefighterName = res.data.name;
					this.infoList = res.data
				});

			},			
			// 筛选节点
			filterNode(value, data) {
				if (!value) return true;
				return data.label.indexOf(value) !== -1;
			},
			// 节点单击事件
			handleNodeClick(data) {
				console.log("data:",data)
			  	this.form.unit = data.label;
				this.form.deptId = data.value;
				// this.queryParams.unit = data.id;
			// this.handleQuery();
			},
			getDeptTree() {
				deptTreeSelect().then(response => {
					console.log("deptTreeSelect:",response.data)
					this.deptOptions = response.data;
				});
			},

			getTreeList(){
				treeSelect().then(response => {
					console.log("treeOptions:",response.data)
					this.treeOptions = response.data;
				});
			},
			// 人员类别列表
			peopleType(e){
				console.log("人员类别:",e)

				this.form.personnelCategory = e.label

				// peopleType(e.id).then(res => {
				// 	console.log("人员类别数据:",res.data)
				// 	// this.rescueRankList = res.data.rescueRank
				// 	// this.technicalPositionList = res.data.technicalPosition
				// 	// this.technicalLevelList = res.data.technicalLevel
				// 	// console.log("消防救援衔列表:",this.rescueRankList)
				// 	// console.log("职务/专业技术职务:",this.technicalPositionList)
				// 	// console.log("职级/专业技术等级:",this.technicalLevelList)
				// })
			},
			// 入职时间数字转化
			jobDate(date){
				console.log("date:",date)
				this.form.workExperience = this.DateNumber(date)
				console.log("工作年限：",this.form.workExperience)
			},
			// 政治面貌切换
			userType(e){
				console.log("政治面貌:",e)
				if(e == "中共党员"){
					this.userTypeRadio = 1
					console.log("this.userTypeRadio:",this.userTypeRadio)
				}else if(e == "共青团员"){
					this.userTypeRadio = 2
					console.log("this.userTypeRadio:",this.userTypeRadio)
				}else if(e == "人民群众"){
					this.userTypeRadio = 3
					console.log("this.userTypeRadio:",this.userTypeRadio)
				}
			},
			// 计算年龄
			DateNumber(date){
				console.log("date:",date)
				const birthDate = new Date(date);
				console.log("birthDate:",birthDate)
				const now = new Date();
				let age = now.getFullYear() - birthDate.getFullYear();
				// console.log("年龄：",age)
				const m = now.getMonth() - birthDate.getMonth();
				if (m < 0 || (m === 0 && now.getDate() < birthDate.getDate())) {
					age--;
				}
				return age;
			},
			// 计算年龄
			userDate(date){
				this.form.age = this.DateNumber(date)
				console.log("年龄：",this.form.age)
			},
			getTypeList(){
				typeList().then(res => {
					console.log("部门列表：",res.data)
					this.typeList = res.data
					this.unitList = res.data
				})
			},
			// 获取列表数据
			getListDate() {
				getDateList().then(res => {
					console.log("数据：", res.data)
					// this.educationList = res.data.education
					this.politicalStatusList = res.data.politicalStatus
					this.punishmentList = res.data.punishment
					// this.unitList = res.data.unit
					this.jobTitleList = res.data.jobTitle
					this.healthStatusList = res.data.healthStatus
					// this.rescueRankList = res.data.rescueRank
					this.birthplaceList = res.data.birthplace
					this.positionList = res.data.position
				})
			},
			/** 查询消防员信息列表 */
			getList() {
				this.loading = true;
				listInfo(this.queryParams).then(response => {
					console.log("查询消防员信息列表:",response.rows)
					console.log(this.typeList)
					this.infoList = response.rows;
					for(let i = 0; i < this.infoList.length;i++){
						for(let j = 0; j < this.typeList.length;j++){
							if(this.infoList[i].deptId == this.typeList[j].deptId){
								// this.infoList[i].deptIdName = this.typeList[j].deptName
								this.infoList[i].deptIdName = this.typeList[j].deptName
							}
						}

					}
					this.total = response.total;
					this.loading = false;
				});
			},
			// 取消按钮
			cancel() {
				this.open = false;
				this.reset();
			},
			// 表单重置
			reset() {
				this.form = {
					id: null,
					userId: null,
					name: null,
					gender: null,
					birthDate: null,
					age: null,
					education: null,
					ethnicity: null,
					birthplace: null,
					politicalStatus: null,
					partyMemberDate: null,
					idCardNumber: null,
					unit: null,
					position: null,
					jobTitle: null,
					entryDate: null,
					workExperience: null,
					rescueRank: null,
					technicalPosition: null,
					firefightingCount: null,
					rescueCount: null,
					healthStatus: null,
					phoneNumber: null,
					graduationSchool: null,
					punishment: null,
					certificateName: null,
					assessment: null,
					avatar: null,
					major: null,
					departmentTitle: null,
					personnelCategory: null,
					technicalLevel: null,
					placeEnlistment: null,
					deptId: null,
					security: null,
					emergency: null,
					fireName: null,
					drill: null,
					fight: null,
					reward: null,
					experienced: null,
					aptitude: null,
					weight:null
				};
				this.resetForm("form");
			},
			/** 搜索按钮操作 */
			handleQuery() {
				this.queryParams.pageNum = 1;
				this.getList();
			},
			/** 重置按钮操作 */
			resetQuery() {
				this.resetForm("queryForm");
				this.handleQuery();
			},
			// 多选框选中数据
			handleSelectionChange(selection) {
				this.ids = selection.map(item => item.id)
				this.single = selection.length !== 1
				this.multiple = !selection.length
			},
			/** 新增按钮操作 */
			handleAdd() {
				this.reset();
				this.open = true;
				this.title = "添加消防员信息";
			},
			/** 修改按钮操作 */
			handleUpdate(row) {
				this.reset();
				const id = row.id || this.ids
				getInfo(id).then(response => {
					this.form = response.data;
					
					this.open = true;
					this.title = "修改消防员信息";
				});
			},
			/** 提交按钮 */
			submitForm() {
				// this.$refs["form"].validate(valid => {
				// 	if (valid) {
						console.log("form:",this.form)
						if (this.form.id != null) {
							updateInfo(this.form).then(response => {
								this.$modal.msgSuccess("修改成功");
								this.open = false;
								this.getList();
							});
						} else {
							addInfo(this.form).then(response => {
								this.$modal.msgSuccess("新增成功");
								this.open = false;
								this.getList();
							});
						}
				// 	}
				// });
			},
			/** 删除按钮操作 */
			handleDelete(row) {
				const ids = row.id || this.ids;
				this.$modal.confirm('是否确认删除消防员信息编号为"' + ids + '"的数据项？').then(function() {
					return delInfo(ids);
				}).then(() => {
					this.getList();
					this.$modal.msgSuccess("删除成功");
				}).catch(() => {});
			},
			/** 导出按钮操作 */
			handleExport() {
				this.download('firefighter/info/export', {
					...this.queryParams
				}, `info_${new Date().getTime()}.xlsx`)
			}
		}
	};
</script>
